﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加商品属性</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" type="text/css" href="common/layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="common/bootstrap/css/bootstrap.css" media="all">
    <link rel="stylesheet" type="text/css" href="common/global.css" media="all">
    <link rel="stylesheet" type="text/css" href="css/personal.css" media="all">
</head>

<style>
    /*日期的css开始*/
    body {
        padding: 20px;
    }

    .demo-input {
        padding-left: 10px;
        height: 38px;
        min-width: 262px;
        line-height: 38px;
        border: 1px solid #e6e6e6;
        background-color: #fff;
        border-radius: 2px;
    }

    .demo-footer {
        padding: 50px 0;
        color: #999;
        font-size: 14px;
    }

        .demo-footer a {
            padding: 0 5px;
            color: #01AAED;
        }
    /*日期的css结束*/
</style>

<!--获取日期js-->
<script src="laydate/laydate.js"></script> 
<script>
    lay('#version').html('-v' + laydate.v);

    //执行一个laydate实例
    laydate.render({
        elem: '#test1' //指定元素
    });
</script>
<!--获取生产日期结束-->
<body>
    <section class="layui-larry-box">
        <div class="larry-personal">
            <header class="larry-personal-tit">
                <span>添加商品属性</span>
            </header><!-- /header -->

            <div class="larry-personal-body clearfix">
                <form class="layui-form col-lg-5" action="" method="post">
                    <div class="layui-form-item">
                        <label class="layui-form-label">生产编号</label>
                        <div class="layui-input-block">
                            <input type="text" autocomplete="off" class="layui-input" placeholder="请输入生产编号">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">有效期</label>
                        <div class="layui-inline">
                            <input type="text" name="username" lay-verify="required" autocomplete="off" class="layui-input " placeholder="请输入管理员昵称">
                        </div>
                        <div class="layui-inline">
                            <select name="browseLook" class="newsLook" lay-filter="browseLook">
                                <option value="0">年</option>
                                <option value="1">天</option>
                            </select>
                        </div>


                    </div>

                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">级别</label>
                            <div class="layui-input-inline">
                                <select name="browseLook" class="newsLook" lay-filter="browseLook">
                                    <option value="0">一级</option>
                                    <option value="1">二级</option>
                                </select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input placeholder="开放浏览" value="开放浏览" readonly="" class="layui-input layui-unselect" type="text"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="0" class="layui-this">开放浏览</dd><dd lay-value="1" class="">会员浏览</dd></dl></div>
                            </div>

                        </div>
                    </div>


                    <div class="layui-form-item">
                        <label class="layui-form-label">生产日期</label>
                        <div class="layui-input-block">
                            <input type="text" class="demo-input" placeholder="请选择日期" id="test1">
                        </div>
                    </div>

                    <div class="layui-form-item layui-form-text">
                        <label class="layui-form-label">工艺描述</label>
                        <div class="layui-input-block">
                            <textarea placeholder="既然选择了远方，便只顾风雨兼程；路漫漫其修远兮，吾将上下而求索" value="" class="layui-textarea"></textarea>
                        </div>
                    </div>




                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </section>
    <script type="text/javascript" src="common/laydate.js"></script>
    <script type="text/javascript" src="common/layui/layui.all.js"></script>
    <script type="text/javascript">

        //执行一个laydate实例
        laydate.render({
            elem: '#datetime' //指定元素
        });

        layui.config({
            base: "js/"
        }).use(['form', 'layer', 'jquery', 'layedit'], function () {
            var form = layui.form,
                layer = parent.layer === undefined ? layui.layer : parent.layer,
                laypage = layui.laypage,
                layedit = layui.layedit,
                $ = layui.jquery;


            //数据验证
            form.verify({
                username: function (value, item) { //value：表单的值、item：表单的DOM对象
                    if (!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)) {
                        return '用户名不能有特殊字符';
                    }
                    if (/(^\_)|(\__)|(\_+$)/.test(value)) {
                        return '用户名首尾不能出现下划线\'_\'';
                    }
                    if (/^\d+\d+\d$/.test(value)) {
                        return '用户名不能全为数字';
                    }
                }

                //我们既支持上述函数式的方式，也支持下述数组的形式
                //数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
                , pass: [
                    /^[\S]{6,12}$/
                    , '密码必须6到12位，且不能出现空格'
                ]
            });


            //此处的addNew是76行代码中提交按钮的 lay-filter属性
            form.on("submit(addNew)", function (data) {

                var index = top.layer.msg('数据提交中，请稍候', { icon: 16, time: false, shade: 0.8 });

                //$.serialize()
                //ajax回调 执行关闭提示窗口
                top.layer.close(index);
                top.layer.msg("添加成功！");
                layer.closeAll("iframe");
                //刷新父页面
                parent.location.reload();

                return false;
            })

        })

    </script>

</body>
</html>